<template>
  <div class="tablePage">
    <!-- 表格 -->

    <div class="aTable" style="height:calc(100% - 250px);">
      <div style="overflow:auto;width:100%;max-height:calc(100vh - 340px);min-width: 760px;;margin-bottom:10px">
        <a-spin :spinning="spinning">
          <a-table :columns="tableColumns" :data-source="tableData" :pagination="false">
            <span slot="action" slot-scope="text">
              <a style="color:#1890ff" @click="onDetail(text)">查看</a>
            </span>
          </a-table>
        </a-spin>
      </div>
      <div class="pagination flexBetweenCenter">
        <div>
          共 {{ pageTotal }} 条记录 第 {{ pageCurrent }} /
          {{ this.configFun.pageNum(Math.ceil(pageTotal / pageSize)) }} 页
        </div>
        <div>
          <a-pagination
            :current="pageCurrent"
            :page-size-options="['5', '10','20']"
            :total="this.configFun.pageNum(pageTotal)"
            show-size-changer
            show-quick-jumper
            :page-size="pageSize"
            @change="pageChange"
            @showSizeChange="sizePageChange"
          >
            <template slot="buildOptionText" slot-scope="props">
              <span>{{ props.value }}条/页</span>
            </template>
          </a-pagination>
        </div>
      </div>
      <!-- 表格分页 -->
    </div>
  </div>
</template>

<script>
export default {
  name: 'tablePage',

  props: ['tableColumns', 'tableData', 'pageCurrent', 'pageTotal', 'pageSize', 'spinning'],
  data() {
    return {}
  },
  methods: {
    //查看人员详情
    onDetail(text) {
      this.$emit('onDetail',text)
    },
    //切换分页
    pageChange(current, pageSize) {
    //   this.pageCurrent = current
    //   this.pageSize = pageSize
    //   this.getTotal(pageSize, current)
    this.$emit('pageChange',[current,pageSize])
    },

    //改变每页条数大小
    sizePageChange(current, pageSize) {
    //   this.pageCurrent = 1
    //   this.pageSize = pageSize
      this.$emit('pageSizeChange',[current,pageSize])
      // this.$emit('pageSizeChange',{current,pageSize})
      //   this.getTotal(pageSize, this.pageCurrent)
    },
    getTable(val) {
      this.tableData = val
    }
  }
  //     computed: {
  //     tableDataValue: function () {
  //       return this.tableData
  //     }
  //   }
}
</script>

<style lang="less" scoped>
</style>
